<template>
	<view>
		<view class="border-bottom betweenX font-30" v-for="(item,index) in serviceList" :key="index">
			<view>客服：{{item}}</view>
			<view @click="handleDial(item)" class="color-primary">拨打</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import { onShow } from '@dcloudio/uni-app'
	import { postMultiGet } from '@/api/currency.js'

	// 打电话
	const serviceList = ref([]);
	const handleService = () => {
		postMultiGet({
			codes: ['service_tel']
		}).then(res => {
			serviceList.value = res?.data?.lists?.service_tel.split(',');
		})
	}

	const handleDial = (tel) => {
		uni.makePhoneCall({
			phoneNumber: tel, // 电话号码
			success: function() {
				console.log('Call successful');
			},
			fail: function(err) {
				console.error('Call failed: ', err);
			}
		});
	}

	onShow(() => {
		handleService();
	})
</script>

<style scoped>
	.border-bottom {
		border-bottom: 1rpx solid #e2d3d3;
		padding: 30rpx;
		box-sizing: border-box;
	}
</style>